<template>
	<view class="mainpadding2">
		<view class="ffffff mainpadding_top radius">
			<view class="titletext bold hei_text">选择充值金额</view>
			<view class="flexleft flex_wrap">
				<view class="flexcenter" style="width: 33.33%;" v-for="item in list" :key="item.id" >
					<view class="lable margin_top " :class="listid==item.id?'itemgl':''" @click="listid=item.id;price=Number(item.price).toFixed(0)">{{item.name}}</view>
				</view>
			</view>
		</view>
		<view class="mainpadding_top ffffff radius">
			<input type="number" class="lan_text titletext bold" placeholder="自定义充值金额" v-model="price">
		</view>
		<view class="mainpadding_top ffffff radius flexbetween">
			<view class="flexleft">
				<image src="@/static/image/system/wxicon.png" class="wximg margin_right" mode=""></image>
				<view class="titletext hei_text bold">微信</view>
			</view>
			<view class="checkaudio"></view>
		</view>
		<view class="posibottom mainpadding">
			<view class="flexcenter xiaohui" @click="jumpurl('/pages_mine/tixianjl?type=2')">充值记录</view>
			<view class="submitbtn margin_top" @click="submit">立即充值</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				price:"",
				openid:"",
				list:[],
				listid:"",
			}
		},
		onShow() {
			this.init()
		},
		methods: {
			init(){
				httpRequest.request('/api/member/recharge_show', 'GET', {
				}, false, false, true).then(res => {
					this.list = res.data
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			submit(){
				httpRequest.request('/api/member/gotorecharge', 'POST', {
					price:this.price,
					platform:"wxMiniProgram",
					pay_type:1,
					openid:this.openid,
				}, false, false, true).then(res => {
					if(res.code==1){
						setTimeout(()=>{
							uni.navigateBack(1)
						},1000)
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			jumpurl(url) {
				uni.navigateTo({
					url
				})
			},
		}
	}
</script>

<style lang="scss">
	.wximg{
		width: 32rpx;
		height: 32rpx;
		min-width: 32rpx;
	}
	.lable{
		width: 180rpx;
		padding: 20rpx 0 ;
	}
</style>
